<template>
	<view class="container">
		<empty v-if="publicList.length == 0"></empty>
		<view class="list_box" v-for="(item,index) in publicList" @click="navToDetails(item)">
			<view class="border"></view>
			<view class="list-icon borderStyle">
				<view style="font-size: 36upx;font-weight: normal;">
					{{item.month}}-{{item.day}}
				</view>
				<view>{{item.year}}</view>
			</view>
			<view class="list_title">{{item.title}}</view>
		</view>
		<!-- 待完善 -->
		<uni-load-more :status="loadingType" style="height: 60upx;"></uni-load-more>
	</view>
</template>

<script>
	import empty from "@/components/empty";
	export default {
		data() {
			return {
				tagName:'',
				tagType:"",
				flag:0,
				areaCode:'',
				loadingType: 'more',
				page:1,
				publicList:[],
				communityId: this.$api.util.getAreaCode(),
			}
		},
		onLoad(options) {
			if(options){
				this.tagType = options.tagType
				this.tagName = options.tagName
				console.log(this.tagName)
				this.getArticalList(this.page,this.tagType,this.tagName)
			}
		},
		onReachBottom() {
			if (this.loadingType === 'more') {
				this.page = this.page + 1;
				this.getArticalList(this.page,this.tagType,this.tagName)
			}
		},
		components: {
			empty
		},
		methods: {
			//查询办事指南
			getArticalList: function(page,tagType,tagName) {
				let that = this;
				this.$api.request.getArticalList({
					"areaCode": this.communityId,
					"pageSize": 10,
					"page": page,
					"tagType": tagType,
					"tagName": tagName,
					"isPublished":true
				}, function(res) {
					if (res.body.status.statusCode === '0') {
						let arrs = res.body.data.list;
						let womenLists = [];
						for (var i = 0; i < arrs.length; i++) {
							if(arrs[i].publishTime){
								let times = arrs[i].publishTime.split(" ")[0].split("-");
								arrs[i].year = times[0];
								arrs[i].month = times[1];
								arrs[i].day = times[2];
								womenLists.push(arrs[i])
							}
						};
						that.publicList = womenLists;
						var total = res.body.data.total
						if (that.publicList.length >= total) {
							that.loadingType = 'noMore'
						}
					}
				})
			},
			navToDetails(item) {
				uni.navigateTo({
					url: '/package_isp/pages/threeAffairs/details?dataUuid='+ item.pressReleaseUuid
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #FBFBFB;
	}

	.container {
		width: 100%;
		/* background-color: #FBFBFB; */
		overflow: hidden;
		padding: 32upx;
	}

	.list_box {
		background: #FFFFFF;
		box-shadow: 2upx 2upx 22upx -2upx rgba(0, 0, 0, 0.1);
		height: 120upx;
		display: flex;
		margin-bottom: 24upx;
	}

	.border {
		width: 10upx;
		height: 100%;
		background: #E54E4E;
	}

	.list-icon {
		font-size: 24upx;
		text-align: center;
		font-weight: lighter;
		margin-right: 32upx;
		padding: 18upx;
		width: 150upx;
		position: relative
	}

	.borderStyle::after {
		content: '';
		position: absolute;
		bottom: 30upx;
		right: 0;
		height: 60upx;
		width: 2upx;
		background-color: #979797;
	}

	.list_title {
		width: 488upx;
		line-height: 120upx;
		border-radius: 50upx;
		font-size: 30upx;
		font-weight: bold;
		transition: all .5s;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
</style>
